import React from 'react'
import { RouterRawState } from '../types'
import MainLayout from '../components/mainLayout'
import { HomeOutlined, SettingOutlined, CloudUploadOutlined, UnorderedListOutlined } from '@ant-design/icons'
const Home = React.lazy(() => import('../views/home'))
const Detail = React.lazy(() => import('../views/detail'))
const List = React.lazy(() => import('../views/list'))
const Login = React.lazy(() => import('../views/login'))
const Set = React.lazy(() => import('../views/set'))
const Upload = React.lazy(() => import('../views/upload'))

export const ROUTER_LIST: RouterRawState[] = [
  {
    path: '/',
    element: <MainLayout>
      <Home></Home>
    </MainLayout>,
    meta: {
      label: '首页',
      rank: 1,
      icon: <HomeOutlined />
    }
  },
  {
    path: '/detail/:id',
    element: <Detail></Detail>,
    meta: {
      label: '详情',
      hidden: true
    }
  },
  {
    path: '/list',
    element: <MainLayout>
      <List></List> 
    </MainLayout> ,
    meta: {
      label: '列表',
      rank: 2,
      icon: <UnorderedListOutlined />,
      roles: ['admin']
    },

  },
  {
    path: '/login',
    element: <Login></Login>,
    meta: {
      label: '登录',
      hidden: true
    }
  },
  {
    path: '/set',
    element: <MainLayout>
      <Set></Set>
    </MainLayout>,
    meta: {
      label: '设置',
      rank: 4,
      icon: <SettingOutlined />,
      roles: ['admin']
    }
  }, {
    path: '/upload',
    element: <MainLayout>
      <Upload></Upload>
    </MainLayout>,
    meta: {
      label: '上传',
      rank: 3,
      icon: <CloudUploadOutlined />
    }
  }
]
